// device service
var Karotz_UPnP_S = "urn:upnp-fonzy007-com:serviceId:Karotz1";

//local ip
var ipaddress = data_request_url;

//global variables
var v_installid="";

var mytable = new Array(["Installation ID","",'installID']);

//*****************************************************************************
//  function: karotzedit
//*****************************************************************************
function karotzedit (device){
	var html = '';
	for(i = 0; i < mytable.length; i++){
		mytable[i][1]=get_device_state (device, Karotz_UPnP_S, mytable[i][2], 1);
	}
	
	{
		// we create a status area
		html += '<div><p id="status_display" style="width:80%; position:relative; margin-left:auto; margin-right:auto; table-layout:fixed; text-align:center; border-radius: 5px; color:black"></div>';
		
		// we create a table which will contain all variables for the Karotz integration
		html += '<table style="width:80%; position:relative; margin-left:auto; margin-right:auto; border-radius: 5px">';

		// show titles
		html += '<tr>';
			html += '<th style="font-weight:bold; text-align:left; width:50%">Variable Name:</td>';
			html += '<th style="font-weight:bold; text-align:left; width:50%">Variable Value:</td>';
		html += '</tr>';
		
		for (i = 0; i < mytable.length; i++){
			html += '<tr>';
			html += '<td>' + mytable[i][0] + '</td>';
			html += '<td><input type="text" id="v' + i + '" value="' + mytable[i][1] + '" style="width:95%; text-align:left" onChange="save(' + device + ', ' + i + ', this.value)" /></td>';
			html += '</tr>';
		}
			
		// show save button
		html += '<tr>';
		html += '<td colspan="2"><input type="button" value="SAVE" onClick="saveall(1,' + device + ')" style="margin-left:87%; background:#3295F8; color:white; text-align:center; border-radius:5px; padding-top:4px; text-transform:capitalize; font-family:Arial; font-size:14px; cursor:pointer; -khtml-border-radius: 5px; -webkit-border-radius:5px"/></td>';
		html += '</tr>';
		html += '</table>';
	}
	set_panel_html (html);
}
//*****************************************************************************
// function: showStatus
//*****************************************************************************
function showStatus (text, error)
{
	if (!error)
	{
		document.getElementById ('status_display').style.backgroundColor = "#90FF90";
		document.getElementById ('status_display').innerHTML = text;
	}
	else
	{
		document.getElementById ('status_display').style.backgroundColor = "#FF9090";
		document.getElementById ('status_display').innerHTML = text;
	}
}
//*****************************************************************************
//  function: save => variable
//*****************************************************************************
function save (deviceid, index, newValue){
	showStatus ("UNSAVED CHANGES!", true);
	mytable[index][1] = newValue;
}

//*****************************************************************************
//  function: saveall
//*****************************************************************************
function saveall (luupcode,device)
{
	showStatus ("SAVING...", false);

	for (i = 0; i < mytable.length; i++){
		var xmlHttp = null;
		xmlHttp = new XMLHttpRequest();
		_console("save " + i + "; " + mytable[i]);
		xmlHttp.open( "GET", ''+ ipaddress +'id=lu_action&serviceId=urn:micasaverde-com:serviceId:HomeAutomationGateway1&action=RunLua&Code=luup.variable_set("'+ Karotz_UPnP_S +'","'+mytable[i][2]+'","'+mytable[i][1]+'",'+ device +')', false );
		xmlHttp.send( null );
	}

	function finished () {showStatus ("ALL CHANGES SAVED!", false);}
	window.setTimeout(finished, 1000);
}